<!--
 * @Descripttion: j机构的查看
 * @version: 
 * @Author: wl
 * @Date: 2020-06-05 13:00:16
 * @LastEditors: wl
 * @LastEditTime: 2020-06-05 14:08:04
--> 

<template>
  <div class="viewPage">
    
    <div class="dialog-content">
      <el-form :model="data" ref="dataForm" label-width="100px" style="text-align:left;">
        <el-form-item label="ID" v-if="false">
          <el-input v-model="data.Id"></el-input>
        </el-form-item>
        <!-- <el-form-item label="序号：">
          <span class="viewSpan">{{data.id}}</span>
        </el-form-item>-->
        <el-form-item label="组名称：">
          <span class="viewSpan">{{data.name}}</span>
        </el-form-item>
        <el-form-item label="小区ID：">
          <el-tag
            v-for="item in data.CODES"
            :key="item"
            type="item.success"
            effect="dark"
          >{{ item }}</el-tag>
        </el-form-item>
        <!-- <el-form-item v-if="data.show" label="单位地址：">
          <span class="viewSpan">{{data.location}}</span>
        </el-form-item>
        <el-form-item v-if="data.show" label="联系电话：">
          <span class="viewSpan">{{data.contactPhone}}</span>
        </el-form-item>-->
      </el-form>
    </div>
    <div class="dialog-toolbar">
      <el-button @click="handleClose">关闭</el-button>
      <el-button type="primary" @click="handleEdit">编辑</el-button>
      <!-- <el-button type="danger" :loading="deleteLoading" @click="handleDelete">删除</el-button> -->
    </div>
  </div>
</template>

<script>
export default {
  name: "view-page",
  props: {
    data: {
      type: Object,
      default: function() {
        return {
         
        };
      }
    }
  },
  data() {
    return {
      /* 删除loading */
      deleteLoading: false
    };
  },
  methods: {
    // 切换编辑状态
    handleEdit: function() {
      this.$emit("clickEdit");
    },
    /* 删除 */
    handleDelete: function() {
      this.$emit("clickDelete", this.data);
    },
    handleClose: function() {
      this.$emit("clickClose", this.data);
    }
  },
  mounted() {
    // console.log(this.data,'dddd')
  }
};
</script>

<style lang='scss' scoped>
.dialog-toolbar{
  width: 45%;
  // margin: 0 auto;
  padding: 20px;
}
</style>